<template>
  <div>
    <div class="margin-top-10">
      <card>
        <p slot="title">本机IP重置（修改后，需重启服务器生效）</p>
        <Form
          ref="localconfigFrom"
          :model="localConfig"
          label-position="left"
          :label-width="100"
          :rules="localRules"
        >
          <Form-item label="网卡选择" prop="interface">
            <Select style="width:158px;" v-model="interface">
              <Option
                v-for="item in localConfigs"
                :key="item.interface"
                :value="item.interface"
              >{{item.interface}}</Option>
            </Select>
          </Form-item>
          <Form-item label="ip" prop="ip">
            <vue-ip-input v-model="localConfig.ip" :showPort="false"></vue-ip-input>请务必确认需要修改的IP真实存在。
          </Form-item>
          <Form-item label="mask" prop="redis_host">
            <input-number v-model="localConfig.mask" style="width: 158px"/>
          </Form-item>
          <Form-item label="gateway" prop="ipc_host">
            <vue-ip-input v-model="localConfig.gateway" :showPort="false"></vue-ip-input>
          </Form-item>
          <Form-item label="dns" prop="recong_host">
            <vue-ip-input v-model="localConfig.dns" :showPort="false"></vue-ip-input>
          </Form-item>
        </Form>
        <Row class="margin-top-20">
          <Button type="primary" @click="handleSave">保存</Button>
          <Button type="primary" @click="handleSaveAndRestart">保存并重启</Button>
        </Row>
      </card>
      <card class="margin-top-10">
        <p slot="title">相关服务配置（修改后，需重启服务器生效）</p>
        <Form
          ref="configFrom"
          :model="config"
          label-position="left"
          :label-width="100"
          :rules="rules"
        >
          <Form-item label="资源系统" prop="res_host">
            <vue-ip-input v-model="config.res_host" :showPort="true"></vue-ip-input>
          </Form-item>
          <Form-item label="推送服务" prop="redis_host">
            <vue-ip-input v-model="config.redis_host" :showPort="true"></vue-ip-input>
          </Form-item>
          <Form-item label="设备管理" prop="ipc_host">
            <vue-ip-input v-model="config.ipc_host" :showPort="true"></vue-ip-input>
          </Form-item>
          <Form-item label="识别服务" prop="recong_host">
            <vue-ip-input v-model="config.recog_host" :showPort="true"></vue-ip-input>
          </Form-item>
          <Form-item label="数据库" prop="mongodb_host">
            <vue-ip-input v-model="config.mongodb_host" :showPort="true"></vue-ip-input>
          </Form-item>
          <Form-item label="管理WEB" prop="web_host">
            <vue-ip-input v-model="config.web_host" :showPort="true"></vue-ip-input>
          </Form-item>
        </Form>
        <Row class="margin-top-20">
          <Button type="primary" @click="handleSubmit">保存</Button>
          <Button type="primary" @click="handleSubmitAndRestart">保存并重启</Button>
        </Row>
      </card>
      <card class="margin-top-10">
        <p slot="title">其它设置</p>
        <Form :label-width="120">
          <Form-item label="陌生人自动入库" prop="stranger_switch">
            <i-switch
              v-model="strangerSwitch"
              @on-change="switchStranger"
              :loading="loadingStranger"
            />
          </Form-item>
          <Form-item label="活体检测" prop="liveness">
            <i-switch v-model="liveness" @on-change="switchLiveness" :loading="loadingLiveness"/>
          </Form-item>
          <Form-item label="数据清除" prop="clean">
            <Button type="primary" @click="handleClean">清空</Button>
          </Form-item>
        </Form>
      </card>
    </div>
    <CleanModal ref="cleanModal" @updated="cleaned"/>
  </div>
</template>

<script>
import Card from "iview/src/components/card/card";
import VueIpInput from "../weiget/HrVueIpInput";
import ME from "src/controllers/localConfig";
import InputNumber from "iview/src/components/input-number/input-number";
import LivenessSetting from "src/controllers/livenessSetting";
import StrangerSetting from "src/controllers/strangerSetting";
import CleanModal from "./components/CleanModal";

export default {
  components: {
    InputNumber,
    VueIpInput,
    Card,
    CleanModal
  },
  name: "host-setting",
  data() {
    const reg = new RegExp(
      "^((25[0-5]|2[0-4]\\d|[01]?\\d\\d?).){3}(25[0-5]|2[0-4]\\d|[01]?\\d\\d?)$"
    );
    const error = new Error("请检查IP");
    const validateIp = (rule, value, callback) => {
      //校验IP
      if (!value.ip || !reg.test(value.ip)) {
        callback(error);
      }
      callback();
    };
    return {
      config: {
        web_host: {},
        ipc_host: {},
        res_host: {},
        recog_host: {},
        mongodb_host: {},
        redis_host: {}
      },
      rules: {
        web_host: [{ validator: validateIp, trigger: "blur" }],
        ipc_host: [{ validator: validateIp, trigger: "blur" }],
        res_host: [{ validator: validateIp, trigger: "blur" }],
        recog_host: [{ validator: validateIp, trigger: "blur" }],
        mongodb_host: [{ validator: validateIp, trigger: "blur" }],
        redis_host: [{ validator: validateIp, trigger: "blur" }]
      },
      localConfig: {
        ip: {},
        mask: 24,
        gateway: {},
        dns: {}
      },
      localRules: {
        ip: [{ validator: validateIp, trigger: "blur" }],
        gateway: [{ validator: validateIp, trigger: "blur" }],
        dns: [{ validator: validateIp, trigger: "blur" }]
      },

      liveness: false,
      loadingLiveness: true,
      interface: "",
      localConfigs: {},
      strangerSwitch: false,
      loadingStranger: false
    };
  },
  mounted() {
    this.loadData();
  },
  methods: {
    cleaned() {},
    handleClean() {
      this.$refs["cleanModal"].showModal();
    },
    switchLiveness(status) {
      this.loadingLiveness = true;
      LivenessSetting.setLiveness({
        detect: status
      }).then(res => {
        this.loadingLiveness = false;
      });
    },
    switchStranger(status) {
      this.loadingStranger = true;
      StrangerSetting.setStrangerSwitch({
        switch: status
      }).then(res => {
        this.loadingStranger = false;
      });
    },
    handleSubmit() {
      this.$refs["configFrom"].validate(valid => {
        if (valid) {
          let data = {
            type: "3",
            value: this.config
          };
          ME.setLocalConfig(data).then(json => {
            if (json.code == 0) {
              this.$Message.info("success");
              this.loadData();
            }
          });
        }
      });
    },
    handleSubmitAndRestart() {
      this.$refs["configFrom"].validate(valid => {
        if (valid) {
          let data = {
            type: "3",
            value: this.config
          };
          ME.setLocalConfig(data).then(json => {
            if (json.code == 0) {
              this.$Modal.info({
                title: "设置成功",
                content: "正在重启机器使其生效。。。。"
              });
              ME.restartConfig();
            }
          });
        }
      });
    },
    loadData() {
      ME.getLocalConfig().then(json => {
        if (json.code == 0) {
          this.config = json.data;
        }
      });
      this.loadingLiveness = true;
      LivenessSetting.getLiveness().then(json => {
        if (json.code == 0) {
          this.loadingLiveness = false;
          this.liveness = json.data.detect;
        }
      });
      this.loadingStranger = true;
      StrangerSetting.getStrangerSwitch().then(json => {
        if (json.code == 0) {
          this.loadingStranger = false;
          this.strangerSwitch = json.data.switch;
        }
      });
      // ME.getLocalIpConfig().then(json => {
      //     if (json.code == 0) {
      //         this.localConfigs = json.data
      //         // this.localConfig.ip.ip = json.data.ip
      //         // this.localConfig.mask = json.data.mask
      //         // this.localConfig.gateway.ip = json.data.gateway
      //         // this.localConfig.dns.ip = json.data.dns
      //     }
      // })
    },
    handleSave() {
      this.$refs["localconfigFrom"].validate(valid => {
        if (valid) {
          //TODO 保存
          let data = {
            interface: this.interface,
            ifconfig: {
              ip: this.localConfig.ip.ip,
              mask: this.localConfig.mask,
              gateway: this.localConfig.gateway.ip,
              dns: this.localConfig.dns.ip
            }
          };

          ME.setLocalIpConfig(data).then(json => {
            console.log(json);
            if (json.code == 0) {
              this.$Modal.info({
                title: "设置成功",
                content: "请重启机器使其生效"
              });
              this.loadData();
            }
          });
        }
      });
    },
    handleSaveAndRestart() {
      this.$refs["localconfigFrom"].validate(valid => {
        if (valid) {
          let data = {
            interface: this.interface,
            ifconfig: {
              ip: this.localConfig.ip.ip,
              mask: this.localConfig.mask,
              gateway: this.localConfig.gateway.ip,
              dns: this.localConfig.dns.ip
            }
          };

          ME.setLocalIpConfig(data).then(json => {
            if (json.code == 0) {
              this.$Modal.info({
                title: "设置成功",
                content: "正在重启机器使其生效。。。。"
              });
              ME.restartConfig();
              // this.loadData()
            }
          });
        }
      });
    }
  },
  watch: {
    interface(val) {
      for (let item of this.localConfigs) {
        if (item.interface == val) {
          this.localConfig.ip = {
            ip: item.ip_config.address
          };
          this.localConfig.mask = item.ip_config.mask;
          this.localConfig.gateway = {
            ip: item.ip_config.gateway
          };
          this.localConfig.dns = {
            ip: item.ip_config.dns
          };
          return;
        }
      }
    }
  }
};
</script>

<style scoped>
</style>